<template>
    <p>个人设置页</p>
    <div>
        手机号 <input type="text" v-model="phone" placeholder="请输入您的手机号码">
    </div>
    <div>
        <button @click="submit">提交</button>
    </div>
    {{ phone }}
</template>

<script setup>
import { ref } from 'vue';
import {useRouter} from 'vue-router'
import {useStore} from 'vuex'
//拿到路由的实例化对象
const router =useRouter()
//拿到Vuex的实例化对象
const store =useStore()



const phone =ref(''
)
const submit =()=>{
    //更新用户信息
    store.commit("updateUserInfo",{
        ...store.state.userInfo,//将原来的用户信息结构出来
        // name:'张三',
        // gender:'男',
        // phone:'13xxx',
        phone
    })
    alert("修改成功")
    router.push("/user/profile")
}
</script>